<template>
<div class="root">
  
  <!-- 头部 -->
  <div class="top"><h2>阅卷管理</h2></div>

  <!-- 表单 -->
  <div class="form">

    <el-form ref="ruleFormRef"  class="demo-ruleForm" status-icon>
      <el-form-item label="关键字" prop="name" style="width: 260px;">
        <el-input v-model="data.key" placeholder="搜索关键字" />
      </el-form-item>
      <el-button type="primary" class="select" @click="inquire">搜索</el-button>
    </el-form>

  </div>

  <!-- 表格 -->
  <el-table :data="exam" class="custom-loading-svg" style="width: 100%">
    <el-table-column prop="title" label="考试名称" />
    <el-table-column prop="info" align="center" header-align="center" label="考试说明" width="290" />
    <el-table-column prop="subjectnum" align="center" header-align="center" label="题量" width="180" />
    <el-table-column prop="studentcounts" align="center" header-align="center" label="考试人数" width="180" />
    <el-table-column prop="qorder" align="center" header-align="center" label="未判人数" width="180" />
    <el-table-column prop="addtime" align="center" header-align="center" label="开放时间" />
    <el-table-column align="center" header-align="center" #default="scope" label="操作" width="100">
      <el-button type="primary" link  @click="read(scope.row.id)">
        {{ scope.row.qorder===1? '查看' : '阅卷' }}
      </el-button>
    </el-table-column>
  </el-table>


  <!-- 分页 -->
  <div class="fenye">
    <FenYe :total="totals" @getChildData='getChildData'></FenYe>
  </div>



</div>
</template>

<script setup lang='ts'>
import {ref,reactive} from 'vue'
import { examList } from "../../api/exam";  //接口
import FenYe from '../../components/fen ye/FenYe.vue' //分页
import route from '../../router/router'


// 表格
let exam = ref([])  //赋值的
let totals:any = ref(0)  // 一共多少条数据

let data = reactive({ //参数
  page: 1,
  psize: 10,
  isread: 1,
  key: '',  //搜索用的
})

let getList = async() => {
  let res = await examList(data)
  console.log(res);
  exam.value = res.data.list
  totals.value = res.data.counts  // 一共多少条数据
}
getList()


// 搜索
let inquire = () => {
  getList()
}

// 分页
const getChildData = (val:any) => {
  console.log(111, val)
  data.page = val.page
  data.psize = val.psize
  getList()
}

// 点击阅卷 跳转
let read = (id:any) => {
  route.push({path:'./review',query:{isread:id}})
}

</script>

<style scoped lang='less'>
  .top{
    h2{
      font-weight: normal
    }
  }
  .form{
    margin-top: 20px;
  }
  .demo-ruleForm{
    display: flex;
  }
  .select{
    margin-left: 20px;
  }
  .fenye{
  display: flex;
  justify-content: center;
  margin-top: 20px;
}
</style>